<?php
	require("../wp-blog-header.php");
	require("event-config.php");
	
	if(get_user_role() != "administrator")
	{
		var_dump(get_user_role());
		header("Location: error.php");
	}
?>

<html>
<head>
	<title>Create Event</title>
	<meta charset='utf-8' />
    <script type="text/javascript" src="js/jquery.js"></script>
	<script src="ckeditor/ckeditor.js"></script>
	<script src="ckeditor/adapters/jquery.js"></script>
    <link rel="stylesheet" type="text/css" href="css/style.css" />
	<script>
		CKEDITOR.disableAutoInline = true;

		$( document ).ready( function() {
			$( '#description' ).ckeditor();
		} );
	</script>
</head>
<body>
    <header>
        <div class="header-wrapper">
            <img src="img/logo.png" class="header-logo" />
            <p class="header-title"><a class="header-link" href="index.php">Quản lí sự kiện</a></p>
            <p class="header-title current">Tạo sự kiện</p>
        </div>
    </header>
    <div class='container'>
    	<div class='post-wrapper'>
			<h4>Tạo sự kiện mới</h4>
    		<form class='form'>
				<table>
					<tr>
						<th><label class="form-label">Tên sự kiện</label><span class="x">*</span></th>
						<th colspan="3"><input type="text" name="name" id="name" placeholder="Tên sự kiện" /></th>
					</tr>
					<tr>
						<th><label class="form-label">Ngày bắt đầu:</label></th>
						<th><input type="datetime-local" name="startDate" id="startDate" /></th>
						<th><label class="form-label">Ngày kết thúc:</label></th>
						<th><input type="datetime-local" name="endDate" id="endDate" /></th>
					</tr>
					<tr>
						<th><label class="form-label">Quyền lợi</label></th>
						<th><input type="text" name="benefit" id="benefit" /></th>
						<th><label class="form-label">Số lượng: </label></th>
						<th><input type="number" name="slot" id="slot" min='0' /></th>
					</tr>
					<tr>
						<th colspan="4"><textarea class="ckeditor" cols="80" id="description" name="description" rows="10"></textarea></th>
					</tr>
					<tr></tr>
					<tr>
						<th><label class="form-label">Câu hỏi</label></th>
						<th colspan="3"><input type="text" name="question" id="question" /></th>
					</tr>
					<tr>
						<th><label class="form-label">Loại</label></th>
						<th><input type="radio" name="type" value="radio" id="type" checked><label class="form-label">Chọn 1</label></th>
						<th><input type="radio" name="type" value="checkbox" id="type"><label class="form-label">Chọn nhiều</label></th>
					</tr>
					<tr>
						<th><label class="form-label">Câu trả lời</label></th>
						<th colspan="3"><textarea cols="60" rows="10" name="answer" id="answer" placeholder="Mỗi đáp án 1 dòng"></textarea></th>
					</tr>
				</table>
    		</form>
    		<button class='submit' type="button" id="btn" onclick="submit()">Tạo sự kiện</button>
    		<img class='loading' src='img/loading.gif' />
    	</div>
	</div>

	<script type="text/javascript">
		function submit () {
			var name = $('#name').val();

			if(name == "")
			{
				alert("Cần phải điền tên sự kiện");
				return;
			}
			$("#btn").css("width", "-=16");
			$(".loading").css("display", "initial");
			
			var startDate 	= $('#startDate').val();
			var endDate 	= $('#endDate').val();
			var benefit 	= $('#benefit').val();
			var description = $('#description').val();
			var slot 		= $('#slot').val();
			var question	= $('#question').val();
			var type 		= $('#type').val();
			var answer 		= $('#answer').val();
			
			$.post("add-event.php", {name: name, startDate: startDate, 
				endDate: endDate, benefit: benefit, 
				description: description, slot: slot,
				question: question, type: type, answer: answer}).done(function(data){
				if(data == 'fail'){
					alert("Can't create event. Try again!!!");
				}
				else{
					window.location.href = 'event.php?p=' + data;
				}
			});
		}
	</script>
</body>
</html>